<template>
  <div class="ai-analysis">
    <el-row :gutter="20">
      <el-col :span="12">
        <el-card>
          <template #header>
            <div class="card-header">
              <span>AI数据分析</span>
            </div>
          </template>
          
          <el-form :model="analysisForm" label-width="120px">
            <el-form-item label="开始期数">
              <el-select
                v-model="analysisForm.start_draw"
                placeholder="选择开始期数"
                style="width: 100%"
              >
                <el-option
                  v-for="draw in drawOptions || []"
                  :key="draw"
                  :label="draw"
                  :value="draw"
                />
              </el-select>
            </el-form-item>
            
            <el-form-item label="结束期数">
              <el-select
                v-model="analysisForm.end_draw"
                placeholder="选择结束期数"
                style="width: 100%"
              >
                <el-option
                  v-for="draw in drawOptions || []"
                  :key="draw"
                  :label="draw"
                  :value="draw"
                />
              </el-select>
            </el-form-item>
            
            <el-form-item label="AI分析提示词">
              <el-input
                v-model="analysisForm.prompt"
                type="textarea"
                :rows="4"
                placeholder="请输入AI分析提示词，留空使用默认提示词..."
                style="width: 100%"
              />
              <div class="prompt-templates">
                <el-text type="info" size="small">快速模板：</el-text>
                <el-button
                  v-for="template in promptTemplates"
                  :key="template.name"
                  type="text"
                  size="small"
                  @click="analysisForm.prompt = template.content"
                >
                  {{ template.name }}
                </el-button>
              </div>
              <div class="prompt-hint">
                <el-text type="info" size="small">
                  提示：您可以自定义AI分析的方向，如"重点分析号码的冷热趋势"、"关注连号和重号规律"等
                </el-text>
              </div>
            </el-form-item>
            
            <el-form-item>
              <el-button
                type="primary"
                @click="startAnalysis"
                :loading="analyzing"
                :disabled="!analysisForm.start_draw || !analysisForm.end_draw"
              >
                <el-icon v-if="analyzing"><Loading /></el-icon>
                {{ analyzing ? 'AI分析中...' : '开始分析' }}
              </el-button>
              <div v-if="analyzing" class="analysis-progress">
                <el-text type="info" size="small">
                  <el-icon><Clock /></el-icon>
                  AI分析可能需要1-2分钟，请耐心等待...
                </el-text>
              </div>
            </el-form-item>
          </el-form>
          
          <div v-if="selectedCount" class="selected-info">
            <el-alert
              :title="`已选择 ${selectedCount} 期数据进行分析`"
              type="info"
              show-icon
            />
          </div>
        </el-card>
      </el-col>
      
      <el-col :span="12">
        <el-card>
          <template #header>
            <div class="card-header">
              <span>预测结果</span>
                             <el-button
                 v-if="currentPrediction && (!currentPrediction.actual_result || Object.keys(currentPrediction.actual_result).length === 0)"
                 type="success"
                 size="small"
                 @click="verifyPrediction"
               >
                 验证结果
               </el-button>
            </div>
          </template>
          
                     <div v-if="analysisResult && Object.keys(analysisResult).length > 0" class="analysis-result">
                         <div class="prediction-info">
               <h4>预测期号：{{ getNextDrawNumber(analysisForm.end_draw) || '' }}</h4>
               <p class="prediction-desc">基于 {{ analysisForm.start_draw || '' }} 至 {{ analysisForm.end_draw || '' }} 共 {{ selectedCount }} 期数据分析</p>
             </div>
            <div class="predictions">
              <h4>预测号码：</h4>
                             <div
                 v-for="(prediction, index) in analysisResult.predictions || []"
                 :key="index"
                 class="prediction-group"
               >
                <span class="group-label">第{{ index + 1 }}组：</span>
                <div class="ball-container">
                                     <span
                     v-for="ball in prediction.red_balls || []"
                     :key="ball"
                     class="ball red-ball"
                   >
                     {{ formatBallNumber(ball) }}
                   </span>
                  <span class="ball blue-ball">
                    {{ formatBallNumber(prediction.blue_ball) }}
                  </span>
                </div>
              </div>
            </div>
            
                                     <div class="analysis-text">
              <h4>分析详情：</h4>
              <div class="analysis-content formatted-text">
                <pre>{{ formatAnalysisText(analysisResult.analysis || '') }}</pre>
              </div>
            </div>
          </div>
          
          <div v-else-if="analyzing" class="analyzing-state">
            <el-empty description="AI分析进行中...">
              <template #image>
                <div class="analyzing-animation">
                  <el-icon class="analyzing-icon"><Loading /></el-icon>
                </div>
              </template>
              <template #description>
                <div class="analyzing-text">
                  <p>AI正在分析历史数据，生成预测结果...</p>
                  <p class="analyzing-tip">请耐心等待，分析可能需要1-2分钟</p>
                </div>
              </template>
            </el-empty>
          </div>
          <div v-else class="no-result">
            <el-empty description="暂无预测结果" />
          </div>
        </el-card>
      </el-col>
    </el-row>
    
    <el-row :gutter="20" style="margin-top: 20px;">
      <el-col :span="24">
        <el-card>
          <template #header>
            <div class="card-header">
              <span>预测历史</span>
            </div>
          </template>
          
                     <el-table :data="predictions || []" style="width: 100%" v-loading="loading">
            <el-table-column label="预测ID" width="80">
              <template #default="scope">
                <span class="prediction-id">{{ scope.row.id }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="start_draw" label="开始期数" width="120" />
            <el-table-column prop="end_draw" label="结束期数" width="120" />
            <el-table-column prop="data_count" label="数据条数" width="100" />
            <el-table-column label="预测号码" width="400">
              <template #default="scope">
                <div
                  v-for="(prediction, index) in scope.row.predicted_numbers || []"
                  :key="index"
                  class="prediction-display"
                >
                  <span class="group-label">第{{ index + 1 }}组：</span>
                  <div class="ball-container">
                    <span
                      v-for="ball in prediction.red_balls || []"
                      :key="ball"
                      :class="['ball', 'red-ball', 'small', { 'matched': scope.row?.actual_result?.verification_results?.[index]?.matched_red_balls?.includes(ball) }]"
                    >
                      {{ formatBallNumber(ball) }}
                    </span>
                    <span :class="['ball', 'blue-ball', 'small', { 'matched': scope.row?.actual_result?.verification_results?.[index]?.matched_blue_ball }]">
                      {{ formatBallNumber(prediction.blue_ball) }}
                    </span>
                  </div>
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="win_amount" label="中奖金额" width="120">
              <template #default="scope">
                <span :class="{ 'win-amount': scope.row.win_amount > 0 }">
                  ¥{{ scope.row.win_amount || 0 }}
                </span>
              </template>
            </el-table-column>
            <el-table-column label="分析详情" width="120">
              <template #default="scope">
                <el-button
                  type="info"
                  size="small"
                  @click="viewAnalysis(scope.row)"
                >
                  查看分析
                </el-button>
              </template>
            </el-table-column>
            <el-table-column prop="created_at" label="预测时间" width="180" />
                         <el-table-column label="预测期" width="120">
               <template #default="scope">
                 <span>{{ getNextDrawNumber(scope.row.end_draw) || '' }}</span>
               </template>
             </el-table-column>
            <el-table-column label="状态" width="100">
              <template #default="scope">
                                 <el-tag
                   :type="scope.row.actual_result && Object.keys(scope.row.actual_result).length > 0 ? 'success' : 'warning'"
                 >
                   {{ scope.row.actual_result && Object.keys(scope.row.actual_result).length > 0 ? '已验证' : '待验证' }}
                 </el-tag>
              </template>
            </el-table-column>
            <el-table-column label="操作" width="120">
              <template #default="scope">
                                 <el-button
                   v-if="!scope.row.actual_result || Object.keys(scope.row.actual_result).length === 0"
                   type="primary"
                   size="small"
                   @click="verifyPrediction(scope.row)"
                   :loading="scope.row.verifying"
                 >
                   验证
                 </el-button>
                 <el-button
                   v-else
                   type="info"
                   size="small"
                   @click="viewResult(scope.row)"
                 >
                   查看结果
                 </el-button>
              </template>
            </el-table-column>
          </el-table>
          
          <div class="pagination-container">
            <el-pagination
              v-model:current-page="pagination.page"
              v-model:page-size="pagination.per_page"
              :page-sizes="[10, 20, 50]"
              :total="pagination.total"
              layout="total, sizes, prev, pager, next, jumper"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
            />
          </div>
        </el-card>
      </el-col>
    </el-row>
    
    <!-- 分析详情弹窗 -->
    <el-dialog
      v-model="analysisDialogVisible"
      title="分析详情"
      width="900px"
      :close-on-click-modal="false"
    >
             <div v-if="currentAnalysis && Object.keys(currentAnalysis).length > 0">
                 <div class="analysis-section">
           <h4>预测期：{{ getNextDrawNumber(currentAnalysis.end_draw) || '' }}</h4>
          
                                <!-- 结束期数开奖数据显示 -->
           <div class="latest-draw-section">
             <h5>结束期数开奖号码：</h5>
             <div class="latest-draw-data">
               <div class="winning-info">
                 <span class="label">期号：</span>
                 <span class="value">{{ currentAnalysis.latest_draw?.draw_number || currentAnalysis.end_draw || '' }}</span>
               </div>
               <div class="winning-info">
                 <span class="label">中奖号码：</span>
                 <div class="ball-container">
                   <span
                     v-for="ball in currentAnalysis.latest_draw?.red_balls || []"
                     :key="ball"
                     class="ball red-ball"
                   >
                     {{ formatBallNumber(ball) }}
                   </span>
                   <span class="ball blue-ball">
                     {{ formatBallNumber(currentAnalysis.latest_draw?.blue_ball) }}
                   </span>
                 </div>
               </div>
             </div>
           </div>
           
           <!-- 中奖数据显示 -->
           <div v-if="currentAnalysis.actual_result && Object.keys(currentAnalysis.actual_result).length > 0" class="winning-data-section">
             <h5>中奖数据：</h5>
             <div class="winning-data">
               <div class="winning-info">
                 <span class="label">开奖期号：</span>
                 <span class="value">{{ currentAnalysis.actual_result.draw_number || '' }}</span>
               </div>
               <div class="winning-info">
                 <span class="label">开奖日期：</span>
                 <span class="value">{{ currentAnalysis.actual_result.draw_date || '' }}</span>
               </div>
               <div class="winning-info">
                 <span class="label">开奖号码：</span>
                 <div class="ball-container" v-if="currentAnalysis.actual_result.actual_red_balls && currentAnalysis.actual_result.actual_red_balls.length > 0">
                   <span
                     v-for="ball in currentAnalysis.actual_result.actual_red_balls"
                     :key="ball"
                     class="ball red-ball"
                   >
                     {{ formatBallNumber(ball) }}
                   </span>
                   <span class="ball blue-ball">
                     {{ formatBallNumber(currentAnalysis.actual_result.actual_blue_ball) }}
                   </span>
                 </div>
                 <div v-else class="no-data-message">
                   <el-tag type="warning" size="small">数据未录入</el-tag>
                   <span class="no-data-text">该期开奖数据尚未录入系统</span>
                 </div>
               </div>
               <div class="winning-info">
                 <span class="label">中奖金额：</span>
                 <span class="value win-amount">¥{{ currentAnalysis.actual_result.total_win_amount || 0 }}</span>
               </div>
                                <div v-if="currentAnalysis.actual_result.prize_info && currentAnalysis.actual_result.prize_info.trim()" class="winning-info">
                   <span class="label">奖金信息：</span>
                   <div class="prize-info formatted-prize">
                     <div v-html="formatPrizeInfo(currentAnalysis.actual_result.prize_info)"></div>
                   </div>
                 </div>
             </div>
           </div>
          
                    <!-- 预测号码显示 -->
          <div class="prediction-section" v-if="currentAnalysis.predicted_numbers && currentAnalysis.predicted_numbers.length > 0">
            <h5>预测号码：</h5>
            <div class="prediction-groups">
              <div
                v-for="(prediction, index) in currentAnalysis.predicted_numbers || []"
                :key="index"
                class="prediction-group"
              >
                <span class="group-label">第{{ index + 1 }}组：</span>
                <div class="ball-container">
                                     <span
                     v-for="ball in prediction.red_balls || []"
                     :key="ball"
                     :class="['ball', 'red-ball', { 'matched': currentAnalysis?.actual_result?.verification_results?.[index]?.matched_red_balls?.includes(ball) }]"
                   >
                     {{ formatBallNumber(ball) }}
                   </span>
                   <span 
                     :class="['ball', 'blue-ball', { 'matched': currentAnalysis?.actual_result?.verification_results?.[index]?.matched_blue_ball }]"
                   >
                     {{ formatBallNumber(prediction.blue_ball) }}
                   </span>
                </div>
                <!-- 中奖信息显示 -->
<!--                <div v-if="currentAnalysis.actual_result.verification_results && currentAnalysis.actual_result.verification_results[index]" class="win-info">-->
<!--                  <el-tag-->
<!--                    :type="currentAnalysis.actual_result.verification_results[index].win_level > 0 ? 'success' : 'info'"-->
<!--                    size="small"-->
<!--                  >-->
<!--                    {{ currentAnalysis.actual_result.verification_results[index].win_level > 0 ? `${currentAnalysis.actual_result.verification_results[index].win_level}等奖` : '未中奖' }}-->
<!--                  </el-tag>-->
<!--                  <span v-if="currentAnalysis.actual_result.verification_results[index].win_level > 0" class="win-amount">-->
<!--                    中奖金额：¥{{ currentAnalysis.actual_result.verification_results[index].win_amount }}-->
<!--                  </span>-->
<!--                </div>-->

                     <div v-if="currentAnalysis?.actual_result?.verification_results?.[index] && Object.keys(currentAnalysis.actual_result.verification_results[index]).length > 0" class="win-info">
                            <el-tag
                 :type="currentAnalysis?.actual_result?.verification_results?.[index]?.win_level && currentAnalysis?.actual_result?.verification_results?.[index]?.win_level > 0 ? 'success' : 'info'"
                 size="small"
               >
                 {{ currentAnalysis?.actual_result?.verification_results?.[index]?.win_level && currentAnalysis?.actual_result?.verification_results?.[index]?.win_level > 0 ? `${currentAnalysis?.actual_result?.verification_results?.[index]?.win_level}等奖` : '未中奖' }}
               </el-tag>
               <span v-if="currentAnalysis?.actual_result?.verification_results?.[index]?.win_level && currentAnalysis?.actual_result?.verification_results?.[index]?.win_level > 0" class="win-amount">
                 中奖金额：¥{{ currentAnalysis?.actual_result?.verification_results?.[index]?.win_amount || 0 }}
               </span>
           </div>

              </div>
            </div>
          </div>
          
                     <!-- 分析内容 -->
           <div class="analysis-content" v-if="currentAnalysis.analysis_result && currentAnalysis.analysis_result.trim()">
             <h5>分析报告：</h5>
             <div class="formatted-text">
               <pre>{{ formatAnalysisText(currentAnalysis.analysis_result || '') }}</pre>
             </div>
           </div>
           

           
           <!-- 如果没有预测号码和分析报告，显示提示 -->
           <div v-if="(!currentAnalysis.predicted_numbers || currentAnalysis.predicted_numbers.length === 0) && (!currentAnalysis.analysis_result || !currentAnalysis.analysis_result.trim())" class="no-prediction-data">
             <el-empty description="暂无预测数据和分析报告" />
           </div>
        </div>
      </div>
      
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="analysisDialogVisible = false">关闭</el-button>
        </span>
      </template>
    </el-dialog>

    <!-- 验证结果弹窗 -->
    <el-dialog
      v-model="resultDialogVisible"
      title="验证结果"
      width="600px"
      :close-on-click-modal="false"
    >
             <div v-if="verificationResult && Object.keys(verificationResult).length > 0">
                 <div class="result-section">
           <h4>预测期：{{ verificationResult.draw_number || '' }}</h4>
          <div class="actual-numbers">
            <h5>实际开奖号码：</h5>
                         <div class="ball-container">
               <span
                 v-for="ball in verificationResult.actual_red_balls || []"
                 :key="ball"
                 class="ball red-ball"
               >
                 {{ formatBallNumber(ball) }}
               </span>
               <span class="ball blue-ball">
                 {{ formatBallNumber(verificationResult.actual_blue_ball) }}
               </span>
             </div>
          </div>
          
          <div class="prediction-results">
            <h5>预测结果对比：</h5>
                         <div
               v-for="(prediction, index) in verificationResult.predictions || []"
               :key="index"
               class="prediction-result-item"
             >
              <div class="prediction-header">
                <span class="group-label">第{{ index + 1 }}组预测：</span>
                                 <el-tag
                   :type="prediction.win_level && prediction.win_level > 0 ? 'success' : 'info'"
                   size="small"
                 >
                   {{ prediction.win_level && prediction.win_level > 0 ? `${prediction.win_level}等奖` : '未中奖' }}
                 </el-tag>
              </div>
              <div class="ball-container">
                                 <span
                   v-for="ball in prediction.red_balls || []"
                   :key="ball"
                   :class="['ball', 'red-ball', 'small', { 'matched': prediction.matched_red_balls?.includes(ball) }]"
                 >
                   {{ formatBallNumber(ball) }}
                 </span>
                 <span
                   :class="['ball', 'blue-ball', 'small', { 'matched': prediction.matched_blue_ball }]"
                 >
                   {{ formatBallNumber(prediction.blue_ball) }}
                 </span>
              </div>
                             <div class="win-info" v-if="prediction.win_level && prediction.win_level > 0">
                 <span>中奖金额：¥{{ prediction.win_amount || 0 }}</span>
               </div>
            </div>
          </div>
          
                     <div class="total-win-info" v-if="verificationResult.total_win_amount && verificationResult.total_win_amount > 0">
             <h5>总中奖金额：¥{{ verificationResult.total_win_amount || 0 }}</h5>
           </div>
          
                     <div class="analysis-content" v-if="verificationResult.analysis_result && verificationResult.analysis_result.trim()">
             <h5>分析详情：</h5>
             <div class="analysis-text formatted-text">
               <pre>{{ formatAnalysisText(verificationResult.analysis_result || '') }}</pre>
             </div>
           </div>
        </div>
      </div>
      
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="resultDialogVisible = false">关闭</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import { ref, reactive, computed, onMounted } from 'vue'
import { ElMessage } from 'element-plus'
import { Loading, Clock } from '@element-plus/icons-vue'
import api from '@/api'

export default {
  name: 'AIAnalysis',
  setup() {
    const loading = ref(false)
    const analyzing = ref(false)
    const predictions = ref([])
    const analysisResult = ref(null)
    const currentPrediction = ref(null)
    const drawOptions = ref([])
    const resultDialogVisible = ref(false)
    const verificationResult = ref(null)
    const analysisDialogVisible = ref(false)
         // const currentAnalysis = ref(null)
     const currentAnalysis = ref({
       predicted_numbers: [],
       analysis_result: '',
       latest_draw: {
         red_balls: [],
         blue_ball: null
       },
       actual_result: {
         verification_results: [],
         actual_red_balls: [],
         actual_blue_ball: null,
         draw_number: '',
         draw_date: '',
         total_win_amount: 0,
         prize_info: ''
       }
     });
         const analysisForm = reactive({
       start_draw: '',
       end_draw: '',
       prompt: ''
     })
     
     // 提示词模板
     const promptTemplates = ref([
       {
         name: '冷热分析',
         content: '请重点分析号码的冷热趋势，识别出现频率高和低的号码，预测下期可能的热号和冷号组合。'
       },
       {
         name: '连号规律',
         content: '请关注连续号码的出现规律，分析连号、重号的趋势，预测下期可能出现的连号组合。'
       },
       {
         name: '奇偶分析',
         content: '请分析奇数偶数的分布规律，关注奇偶比例的变化趋势，预测下期最佳的奇偶搭配。'
       },
       {
         name: '大小分析',
         content: '请分析大号小号的分布规律，关注大小号比例的变化，预测下期最佳的大小号搭配。'
       },
       {
         name: '和值分析',
         content: '请分析历史开奖号码的和值分布，关注和值的变化趋势，预测下期可能的和值范围。'
       },
       {
         name: '综合分析',
         content: '请综合分析号码的冷热趋势、奇偶比例、大小分布、连号规律等多个维度，提供全面的预测建议。'
       }
     ])
    
    const pagination = reactive({
      page: 1,
      per_page: 10,
      total: 0
    })
    
         const selectedCount = computed(() => {
       if (!analysisForm.start_draw || !analysisForm.end_draw || !drawOptions.value || drawOptions.value.length === 0) return 0
       
       const startIndex = drawOptions.value.indexOf(analysisForm.start_draw)
       const endIndex = drawOptions.value.indexOf(analysisForm.end_draw)
       
       if (startIndex === -1 || endIndex === -1) return 0
       
       return Math.abs(endIndex - startIndex) + 1
     })
    
         // 格式化球号
     const formatBallNumber = (num) => {
       if (num === null || num === undefined || num === '' || isNaN(num)) {
         return '00'
       }
       return String(num).padStart(2, '0')
     }
     
     // 格式化分析文本
     const formatAnalysisText = (text) => {
       if (!text) return ''
       
       return text
         // 替换标题格式
         .replace(/###\s*(.*?)[:：]/g, '\n\n🎯 $1：')
         .replace(/####\s*(.*?)[:：]/g, '\n\n📊 $1：')
         .replace(/\*\*(.*?)\*\*/g, '▶ $1')
         
         // 处理主要章节
         .replace(/预测号码[:：]/g, '\n\n🎲 预测号码：')
         .replace(/分析说明[:：]/g, '\n\n📈 分析说明：')
         .replace(/分析依据[:：]/g, '\n\n📋 分析依据：')
         .replace(/杀号分析[:：]/g, '\n\n❌ 杀号分析：')
         .replace(/选号分析[:：]/g, '\n\n✅ 选号分析：')
         
         // 处理预测号码格式 - 特殊处理第X组格式
         .replace(/🔴\s*第(\d+)组[:：]?\s*\[([^\]]+)\]\s*,?\s*🔵\s*蓝球\s*(\d+)/g, '\n  第$1组：🔴 【$2】 🔵 蓝球$3')
         .replace(/第(\d+)组[:：]?\s*\[([^\]]+)\]\s*,?\s*蓝球\s*(\d+)/g, '\n  第$1组：🔴 【$2】 🔵 蓝球$3')
         
         // 处理红球蓝球信息
         .replace(/红球\[([^\]]+)\]/g, '🔴 【$1】')
         .replace(/蓝球\s*(\d+)/g, ' 🔵 蓝球$1')
         .replace(/红球(\d+)/g, '🔴 红球$1')
         
         // 处理概率和成功率信息
         .replace(/成功率[:：]?\s*约?(\d+%)/g, '📊 成功率: $1')
         .replace(/概率[:：]?\s*约?(\d+%)/g, '📊 概率: $1')
         .replace(/出现\d+次/g, (match) => `📈 ${match}`)
         
         // 处理分割线
         .replace(/[-─]{3,}/g, '\n' + '─'.repeat(50) + '\n')
         .replace(/\*{3,}/g, '★'.repeat(3))
         
         // 处理列表项
         .replace(/^\s*[-•]\s+/gm, '  • ')
         .replace(/^(\d+)[\.、]\s*/gm, '$1. ')
         
         // 处理数字范围和特殊格式
         .replace(/\[([^\]]+)\]/g, '【$1】')
         .replace(/\(([^)]+)\)/g, '（$1）')
         
         // 清理格式
         .replace(/\n{3,}/g, '\n\n')
         .replace(/^\s+|\s+$/g, '')
         .trim()
     }
     
     // 格式化奖金信息
     const formatPrizeInfo = (prizeInfo) => {
       if (!prizeInfo) return ''
       
       try {
         // 尝试解析JSON格式的奖金信息
         const prizeData = JSON.parse(prizeInfo)
         
         let formattedHtml = '<div class="prize-list">'
         
         if (Array.isArray(prizeData)) {
           prizeData.forEach((prize, index) => {
             if (prize.type && prize.typenum && prize.typemoney) {
               const prizeNames = {
                 1: '一等奖', 2: '二等奖', 3: '三等奖', 
                 4: '四等奖', 5: '五等奖', 6: '六等奖'
               }
               
               const prizeName = prizeNames[prize.type] || `${prize.type}等奖`
               const count = prize.typenum || 0
               const money = prize.typemoney || 0
               
               if (count > 0) {
                 formattedHtml += `
                   <div class="prize-item">
                     <span class="prize-name">${prizeName}：</span>
                     <span class="prize-count">${count}注</span>
                     <span class="prize-money">单注¥${money}</span>
                   </div>
                 `
               }
             }
           })
         }
         
         formattedHtml += '</div>'
         return formattedHtml
         
       } catch (e) {
         // 如果不是JSON格式，直接返回格式化的文本
         return `<pre class="prize-text">${prizeInfo}</pre>`
       }
     }
    
         const loadDrawOptions = async () => {
       try {
         const response = await api.lottery.getList({ page: 1, per_page: 1000 })
         const data = response.data.data || []
         drawOptions.value = data.map(item => item?.draw_number || '').filter(Boolean).reverse()
       } catch (error) {
         console.error('加载期数选项失败:', error)
         ElMessage.error('加载期数选项失败')
       }
     }
    
         const loadPredictions = async () => {
       try {
         loading.value = true
         const params = {
           page: pagination.page,
           per_page: pagination.per_page
         }
         
         const response = await api.ai.getPredictions(params)
         predictions.value = response.data.data || []
         pagination.total = response.data.total || 0
         
         // 确保每个预测记录都有必要的字段
         predictions.value.forEach(prediction => {
           if (!prediction) return;
           
           if (!prediction.actual_result) {
             prediction.actual_result = {
               verification_results: [],
               actual_red_balls: [],
               actual_blue_ball: null,
               draw_number: '',
               draw_date: '',
               total_win_amount: 0,
               prize_info: ''
             };
           } else if (prediction.actual_result.verification_results === undefined) {
             prediction.actual_result.verification_results = [];
           }
           
           if (!prediction.predicted_numbers) {
             prediction.predicted_numbers = [];
           }
           
           if (!prediction.analysis_result) {
             prediction.analysis_result = '';
           }
           
           if (!prediction.latest_draw) {
             prediction.latest_draw = {
               red_balls: [],
               blue_ball: null
             };
           }
           // use context7: 列表端本地计算中奖同步金额
           try {
             const actualReds = prediction.actual_result?.actual_red_balls || []
             const actualBlue = prediction.actual_result?.actual_blue_ball
             if (Array.isArray(actualReds) && actualReds.length === 6 && actualBlue) {
               let totalAmount = 0
               const levelAmount = (redMatches, blueMatch) => {
                 if (redMatches === 6 && blueMatch) return { level: 1, amount: 5000000 }
                 if (redMatches === 6 && !blueMatch) return { level: 2, amount: 100000 }
                 if (redMatches === 5 && blueMatch) return { level: 3, amount: 3000 }
                 if (redMatches === 5 && !blueMatch) return { level: 4, amount: 200 }
                 if (redMatches === 4 && blueMatch) return { level: 4, amount: 200 }
                 if (redMatches === 4 && !blueMatch) return { level: 5, amount: 10 }
                 if (redMatches === 3 && blueMatch) return { level: 5, amount: 10 }
                 if (blueMatch && (redMatches === 2 || redMatches === 1 || redMatches === 0)) return { level: 6, amount: 5 }
                 return { level: 0, amount: 0 }
               }
               prediction.actual_result.verification_results = (prediction.predicted_numbers || []).map((g) => {
                 const matchedReds = (g?.red_balls || []).filter((b) => actualReds.includes(b))
                 const blueMatch = g?.blue_ball === actualBlue
                 const { level, amount } = levelAmount(matchedReds.length, blueMatch)
                 totalAmount += amount
                 return {
                   matched_red_balls: matchedReds,
                   matched_blue_ball: blueMatch,
                   win_level: level,
                   win_amount: amount
                 }
               })
               prediction.actual_result.total_win_amount = totalAmount
               if (!prediction.win_amount || prediction.win_amount === 0) {
                 prediction.win_amount = totalAmount
               }
             }
           } catch (e) {
             console.error('列表本地计算中奖信息失败:', e)
           }
         });
       } catch (error) {
         console.error('加载预测历史失败:', error)
         ElMessage.error('加载预测历史失败')
       } finally {
         loading.value = false
       }
     }
    
         const startAnalysis = async () => {
       try {
         analyzing.value = true
         
         // 显示进度提示
         ElMessage.info('AI分析正在进行中，请耐心等待...')
         
         // 添加调试日志
         console.log('[DEBUG] 发送的分析表单数据:', analysisForm)
         console.log('[DEBUG] prompt字段值:', analysisForm.prompt)
         
         // 设置更长的超时时间用于AI分析
         const response = await api.ai.analyze(analysisForm)
         
         analysisResult.value = {
           predictions: response.data.predictions || [],
           analysis: response.data.analysis || ''
         }
         
         currentPrediction.value = {
           id: response.data.prediction_id || null,
           actual_result: null
         }
         
         ElMessage.success('AI分析完成！')
         await loadPredictions()
       } catch (error) {
         console.error('分析失败:', error)
         
         // 根据错误类型显示不同的错误信息
         if (error.code === 'ECONNABORTED') {
           ElMessage.error('AI分析超时，请稍后重试或减少分析数据量')
         } else if (error.response?.status === 500) {
           ElMessage.error('服务器处理AI分析时出错，请稍后重试')
         } else if (error.response?.status === 413) {
           ElMessage.error('分析数据量过大，请减少期数范围')
         } else {
           ElMessage.error('AI分析失败: ' + (error.response?.data?.error || error.message || '未知错误'))
         }
       } finally {
         analyzing.value = false
       }
     }
    

    
    const handleSizeChange = (size) => {
      pagination.per_page = size
      pagination.page = 1
      loadPredictions()
    }
    
    const handleCurrentChange = (page) => {
      pagination.page = page
      loadPredictions()
    }
    
         // 获取下一期期号
     const getNextDrawNumber = (endDraw) => {
       if (!endDraw || typeof endDraw !== 'string' || endDraw.length < 7) return ''
       const year = endDraw.substring(0, 4)
       const number = parseInt(endDraw.substring(4))
       if (isNaN(number)) return ''
       return `${year}${(number + 1).toString().padStart(3, '0')}`
     }
     
     // 获取上一期期号
     const getPreviousDrawNumber = (endDraw) => {
       if (!endDraw || typeof endDraw !== 'string' || endDraw.length < 7) return ''
       const year = endDraw.substring(0, 4)
       const number = parseInt(endDraw.substring(4))
       if (isNaN(number)) return ''
       return `${year}${(number - 1).toString().padStart(3, '0')}`
     }
     
     // 获取上一期期号（基于预测期号）
     const getPreviousDrawNumberFromPrediction = (endDraw) => {
       const predictedDraw = getNextDrawNumber(endDraw)
       if (!predictedDraw) return '2025087'
       return getPreviousDrawNumber(predictedDraw)
     }
    
    // 验证预测
    // const verifyPrediction = async (prediction) => {
    //   try {
    //     prediction.verifying = true
    //
    //     const response = await api.ai.verify({ prediction_id: prediction.id })
    //
    //     if (response.data.success) {
    //       ElMessage.success('验证成功')
    //       // 更新预测记录
    //       Object.assign(prediction, response.data.prediction)
    //       // 显示验证结果
    //       verificationResult.value = response.data.verification_result
    //       resultDialogVisible.value = true
    //     } else {
    //       ElMessage.error(response.data.error || '验证失败')
    //     }
    //   } catch (error) {
    //     console.error('验证预测失败:', error)
    //     ElMessage.error('验证失败: ' + (error.response?.data?.error || error.message))
    //   } finally {
    //     prediction.verifying = false
    //   }
    // }
      const verifyPrediction = async (prediction) => {
     try {
       // 如果没有传入 prediction 参数，使用 currentPrediction
       const targetPrediction = prediction || currentPrediction.value;
       if (!targetPrediction) {
         ElMessage.error('没有可验证的预测');
         return;
       }
       
       targetPrediction.verifying = true;

       const response = await api.ai.verify({ prediction_id: targetPrediction.id });
       console.log('verifyPrediction response:', response); // 输出 response 的实际内容

       if (response.data.success) {
         ElMessage.success('验证成功');
         const updatedPrediction = response.data.prediction;
         
         // 确保 actual_result 存在
         if (!updatedPrediction.actual_result) {
           updatedPrediction.actual_result = {
             verification_results: [],
             actual_red_balls: [],
             actual_blue_ball: null,
             draw_number: '',
             draw_date: '',
             total_win_amount: 0,
             prize_info: ''
           };
         } else if (updatedPrediction.actual_result.verification_results === undefined) {
           updatedPrediction.actual_result.verification_results = [];
         }
         
         Object.assign(targetPrediction, updatedPrediction);
         verificationResult.value = response.data.verification_result || {};
         resultDialogVisible.value = true;
       } else {
         ElMessage.error(response.data.error || '验证失败');
       }
     } catch (error) {
       console.error('验证预测失败:', error);
       ElMessage.error('验证失败: ' + (error.response?.data?.error || error.message));
     } finally {
       if (prediction) {
         prediction.verifying = false;
       } else if (currentPrediction.value) {
         currentPrediction.value.verifying = false;
       }
     }
   }
    
         // 查看结果
     const viewResult = (prediction) => {
       if (prediction.verification_result && Object.keys(prediction.verification_result).length > 0) {
         verificationResult.value = prediction.verification_result
         resultDialogVisible.value = true
       } else if (prediction.actual_result && prediction.actual_result.verification_result && Object.keys(prediction.actual_result.verification_result).length > 0) {
         verificationResult.value = prediction.actual_result.verification_result
         resultDialogVisible.value = true
       } else {
         ElMessage.warning('暂无验证结果')
       }
     }
    
    // 获取指定期数的开奖数据
    const loadDrawByNumber = async (drawNumber) => {
      try {
        const response = await api.lottery.getList({ 
          page: 1, 
          per_page: 1000,
          draw_number: drawNumber 
        })
        const data = response.data.data || []
        const targetDraw = data.find(item => item.draw_number === drawNumber)
        if (targetDraw) {
          return {
            draw_number: targetDraw.draw_number,
            red_balls: [
              targetDraw.red_ball_1,
              targetDraw.red_ball_2,
              targetDraw.red_ball_3,
              targetDraw.red_ball_4,
              targetDraw.red_ball_5,
              targetDraw.red_ball_6
            ],
            blue_ball: targetDraw.blue_ball
          }
        }
        return null
      } catch (error) {
        console.error('获取指定期数开奖数据失败:', error)
        return null
      }
    }
    
    // 获取最新中奖数据
    const loadLatestDraw = async () => {
      try {
        const response = await api.lottery.getStatistics()
        const latestDraw = response.data.latest_draw
        if (latestDraw) {
          return {
            draw_number: latestDraw.draw_number,
            red_balls: [
              latestDraw.red_ball_1,
              latestDraw.red_ball_2,
              latestDraw.red_ball_3,
              latestDraw.red_ball_4,
              latestDraw.red_ball_5,
              latestDraw.red_ball_6
            ],
            blue_ball: latestDraw.blue_ball
          }
        }
        return null
      } catch (error) {
        console.error('获取最新中奖数据失败:', error)
        return null
      }
    }
    
    // 查看分析详情
    const viewAnalysis = async (row) => {
      console.log('viewAnalysis row:', row); // 输出 row 的实际内容
      console.log('analysis_result:', row.analysis_result); // 输出分析结果
      
      if (!row) {
        ElMessage.error('无效的分析数据');
        return;
      }
      
      // 确保 actual_result 存在
      if (!row.actual_result) {
        row.actual_result = {
          verification_results: [],
          actual_red_balls: [],
          actual_blue_ball: null,
          draw_number: '',
          draw_date: '',
          total_win_amount: 0,
          prize_info: ''
        };
      } else if (row.actual_result.verification_results === undefined) {
        row.actual_result.verification_results = [];
      }
      
      // 确保 predicted_numbers 存在
      if (!row.predicted_numbers) {
        row.predicted_numbers = [];
      }
      
      // 确保 analysis_result 存在
      if (!row.analysis_result) {
        row.analysis_result = '';
      }
      
      // 获取结束期数的开奖数据
      const endDraw = await loadDrawByNumber(row.end_draw)
      if (endDraw) {
        row.latest_draw = endDraw
      } else {
        // 如果没有获取到结束期数数据，尝试获取最新数据作为备选
        const latestDraw = await loadLatestDraw()
        if (latestDraw) {
          row.latest_draw = latestDraw
        } else {
          // 如果都没有获取到数据，使用空数组
          row.latest_draw = {
            red_balls: [],
            blue_ball: null
          }
        }
      }
      
      // 获取下一期（预测期）的开奖数据作为中奖数据
      const nextDrawNumber = getNextDrawNumber(row.end_draw)
      if (nextDrawNumber) {
        const nextDraw = await loadDrawByNumber(nextDrawNumber)
        if (nextDraw) {
          // 更新 actual_result 为中奖数据
          row.actual_result = {
            draw_number: nextDraw.draw_number,
            actual_red_balls: nextDraw.red_balls,
            actual_blue_ball: nextDraw.blue_ball,
            draw_date: '', // 可以从后端获取日期
            total_win_amount: 0,
            prize_info: '',
            verification_results: []
          }
          // 本地计算每组命中情况，便于即时高亮（use context7）
          try {
            const actualReds = row.actual_result.actual_red_balls || []
            const actualBlue = row.actual_result.actual_blue_ball
            let totalAmount = 0
            const levelAmount = (redMatches, blueMatch) => {
              if (redMatches === 6 && blueMatch) return { level: 1, amount: 5000000 }
              if (redMatches === 6 && !blueMatch) return { level: 2, amount: 100000 }
              if (redMatches === 5 && blueMatch) return { level: 3, amount: 3000 }
              if (redMatches === 5 && !blueMatch) return { level: 4, amount: 200 }
              if (redMatches === 4 && blueMatch) return { level: 4, amount: 200 }
              if (redMatches === 4 && !blueMatch) return { level: 5, amount: 10 }
              if (redMatches === 3 && blueMatch) return { level: 5, amount: 10 }
              if (blueMatch && (redMatches === 2 || redMatches === 1 || redMatches === 0)) return { level: 6, amount: 5 }
              return { level: 0, amount: 0 }
            }
            row.actual_result.verification_results = (row.predicted_numbers || []).map((g) => {
              const matchedReds = (g?.red_balls || []).filter((b) => actualReds.includes(b))
              const blueMatch = g?.blue_ball === actualBlue
              const { level, amount } = levelAmount(matchedReds.length, blueMatch)
              totalAmount += amount
              return {
                matched_red_balls: matchedReds,
                matched_blue_ball: blueMatch,
                win_level: level,
                win_amount: amount
              }
            })
            row.actual_result.total_win_amount = totalAmount
          } catch (e) {
            console.error('本地计算命中情况失败:', e)
          }
        } else {
          // 如果没有找到下一期数据，显示提示信息
          console.warn(`未找到期数 ${nextDrawNumber} 的开奖数据`)
          row.actual_result = {
            draw_number: nextDrawNumber,
            actual_red_balls: [],
            actual_blue_ball: null,
            draw_date: '',
            total_win_amount: 0,
            prize_info: `期数 ${nextDrawNumber} 的开奖数据尚未录入系统`,
            verification_results: []
          }
        }
      }
      
      currentAnalysis.value = row;
      analysisDialogVisible.value = true;
    }
    onMounted(() => {
      loadDrawOptions()
      loadPredictions()
    })
    
    return {
      loading,
      analyzing,
      predictions,
      analysisResult,
      currentPrediction,
      drawOptions,
      analysisForm,
      promptTemplates,
      pagination,
      selectedCount,
      resultDialogVisible,
      verificationResult,
      analysisDialogVisible,
      currentAnalysis,
      formatBallNumber,
      formatAnalysisText,
      formatPrizeInfo,
      startAnalysis,
      loadDrawOptions,
      loadPredictions,
      handleSizeChange,
      handleCurrentChange,
      getNextDrawNumber,
      loadDrawByNumber,
       getPreviousDrawNumber,
       getPreviousDrawNumberFromPrediction,
       verifyPrediction,
       viewResult,
       viewAnalysis
    }
  }
}
</script>

<style scoped>
.ai-analysis {
  padding: 20px;
}

.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.selected-info {
  margin-top: 20px;
}

.prompt-templates {
  margin: 8px 0;
  padding: 8px 0;
}

.prompt-templates .el-button {
  margin: 0 8px 4px 0;
  padding: 4px 8px;
  font-size: 12px;
  border-radius: 4px;
  background-color: #f0f9ff;
  border-color: #0ea5e9;
  color: #0ea5e9;
}

.prompt-templates .el-button:hover {
  background-color: #0ea5e9;
  color: white;
}

.prompt-hint {
  margin-top: 8px;
}

.analysis-result {
  min-height: 300px;
}

.formatted-text {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
  border-radius: 12px;
  padding: 20px;
  border-left: 4px solid #1890ff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  margin: 8px 0;
}

.formatted-text pre {
  margin: 0;
  white-space: pre-wrap;
  word-wrap: break-word;
  font-family: 'SF Pro Text', 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  font-size: 14px;
  line-height: 1.8;
  color: #2c3e50;
  background: transparent;
  border: none;
  padding: 0;
  letter-spacing: 0.3px;
}

/* 为emoji添加间距 */
.formatted-text pre::first-line {
  font-weight: 600;
  color: #1890ff;
}

.analysis-content .formatted-text {
  max-height: 400px;
  overflow-y: auto;
  margin-top: 8px;
}

.analysis-text .formatted-text {
  max-height: 300px;
  overflow-y: auto;
}

/* 美化滚动条 */
.formatted-text::-webkit-scrollbar {
  width: 6px;
}

.formatted-text::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 3px;
}

.formatted-text::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 3px;
}

.formatted-text::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}

/* 响应式设计 */
@media (max-width: 768px) {
  .formatted-text {
    padding: 16px;
    font-size: 13px;
  }
  
  .analysis-content .formatted-text {
    max-height: 300px;
  }
  
  .analysis-text .formatted-text {
    max-height: 250px;
  }
}

/* 奖金信息样式 */
.formatted-prize {
  margin-top: 8px;
}

.prize-list {
  background: #f8f9fa;
  border-radius: 8px;
  padding: 12px;
  border-left: 3px solid #28a745;
}

.prize-item {
  display: flex;
  align-items: center;
  padding: 6px 0;
  border-bottom: 1px solid #e9ecef;
}

.prize-item:last-child {
  border-bottom: none;
}

.prize-name {
  font-weight: 600;
  color: #495057;
  min-width: 80px;
}

.prize-count {
  color: #007bff;
  font-weight: 500;
  margin: 0 12px;
  min-width: 50px;
}

.prize-money {
  color: #28a745;
  font-weight: 600;
}

.prize-text {
  background: #f8f9fa;
  padding: 8px;
  border-radius: 4px;
  font-size: 13px;
  color: #6c757d;
}

.prediction-info {
  margin-bottom: 20px;
  padding: 15px;
  background-color: #f0f9ff;
  border-radius: 8px;
  border-left: 4px solid #409eff;
}

.prediction-info h4 {
  margin: 0 0 8px 0;
  color: #409eff;
  font-weight: bold;
  font-size: 16px;
}

.prediction-desc {
  margin: 0;
  color: #666;
  font-size: 14px;
}

.predictions {
  margin-bottom: 20px;
}

.prediction-group {
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

.group-label {
  font-weight: bold;
  margin-right: 10px;
  min-width: 60px;
}

.ball-container {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.result-section {
  padding: 20px 0;
}

.actual-numbers {
  margin: 20px 0;
}

.prediction-results {
  margin: 20px 0;
}

.prediction-result-item {
  margin: 15px 0;
  padding: 15px;
  border: 1px solid #e4e7ed;
  border-radius: 8px;
  background-color: #fafafa;
}

.prediction-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.win-info {
  margin-top: 10px;
  color: #67c23a;
  font-weight: bold;
}

.total-win-info {
  margin-top: 20px;
  padding: 15px;
  background-color: #f0f9ff;
  border-radius: 8px;
  text-align: center;
}

.total-win-info h5 {
  margin: 0;
  color: #409eff;
}

.analysis-content {
  margin-top: 20px;
  padding: 15px;
  background-color: #f8f9fa;
  border-radius: 8px;
  border-left: 4px solid #409eff;
}

.analysis-content h5 {
  margin: 0 0 10px 0;
  color: #409eff;
  font-weight: bold;
}

.analysis-text pre {
  margin: 0;
  white-space: pre-wrap;
  word-wrap: break-word;
  font-family: 'Courier New', monospace;
  font-size: 14px;
  line-height: 1.5;
  color: #333;
  background-color: #fff;
  padding: 10px;
  border-radius: 4px;
  border: 1px solid #e4e7ed;
}

.analysis-section {
  padding: 20px 0;
}

.analysis-section h4 {
  margin: 0 0 15px 0;
  color: #409eff;
  font-weight: bold;
}

.winning-data-section {
  margin: 20px 0;
  padding: 15px;
  background-color: #f0f9ff;
  border-radius: 8px;
  border-left: 4px solid #67c23a;
}

.winning-data-section h5 {
  margin: 0 0 15px 0;
  color: #67c23a;
  font-weight: bold;
}

 .latest-draw-section {
   margin: 20px 0;
   padding: 15px;
   background-color: #fff7e6;
   border-radius: 8px;
   border-left: 4px solid #fa8c16;
 }
 
 .latest-draw-section h5 {
   margin: 0 0 15px 0;
   color: #fa8c16;
   font-weight: bold;
 }
 
 .latest-draw-data {
   display: flex;
   flex-direction: column;
   gap: 10px;
 }
 
 .winning-data {
   display: flex;
   flex-direction: column;
   gap: 10px;
 }

.winning-info {
  display: flex;
  align-items: center;
  gap: 10px;
}

.winning-info .label {
  font-weight: bold;
  color: #606266;
  min-width: 80px;
}

.winning-info .value {
  color: #303133;
}

.prediction-section {
  margin: 20px 0;
  padding: 15px;
  background-color: #f8f9fa;
  border-radius: 8px;
  border-left: 4px solid #e6a23c;
}

.prediction-section h5 {
  margin: 0 0 15px 0;
  color: #e6a23c;
  font-weight: bold;
}

.prediction-groups {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.prize-info {
  margin-top: 10px;
}

.prize-info pre {
  margin: 0;
  white-space: pre-wrap;
  word-wrap: break-word;
  font-family: 'Courier New', monospace;
  font-size: 12px;
  line-height: 1.4;
  color: #333;
  background-color: #fff;
  padding: 8px;
  border-radius: 4px;
  border: 1px solid #e4e7ed;
  max-height: 150px;
  overflow-y: auto;
}

.ball.matched {
  background-color: #67c23a !important;
  color: white !important;
  border-color: #67c23a !important;
}

.ball {
  display: inline-block;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  border-radius: 50%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

.ball.small {
  width: 20px;
  height: 20px;
  line-height: 20px;
  font-size: 10px;
}

.red-ball {
  background-color: #f56c6c;
}

.blue-ball {
  background-color: #409eff;
}

.analysis-text {
  border-top: 1px solid #eee;
  padding-top: 20px;
}

.no-result {
  text-align: center;
  padding: 40px 0;
}

.prediction-display {
  margin-bottom: 5px;
  display: flex;
  align-items: center;
}

.win-amount {
  color: #67c23a;
  font-weight: bold;
}

.pagination-container {
  margin-top: 20px;
  text-align: right;
}

.prediction-id {
  font-weight: bold;
  color: #409eff;
  font-family: 'Courier New', monospace;
  background-color: #f0f9ff;
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid #409eff;
}

.analysis-progress {
  margin-top: 10px;
  padding: 10px;
  background-color: #f0f9ff;
  border-radius: 6px;
  border-left: 3px solid #409eff;
}

.analysis-progress .el-text {
  display: flex;
  align-items: center;
  gap: 6px;
}

.analysis-progress .el-icon {
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

.analyzing-state {
  text-align: center;
  padding: 40px 0;
}

.analyzing-animation {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
}

.analyzing-icon {
  font-size: 48px;
  color: #409eff;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.analyzing-text {
  color: #606266;
}

.analyzing-text p {
  margin: 8px 0;
}

.analyzing-tip {
  color: #909399;
  font-size: 14px;
}

.no-data-message {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
}

.no-data-text {
  color: #909399;
  font-size: 14px;
}
</style> 